<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<div th:replace="fragment/front/meta"></div>
        <title th:utext="${application.siteName + ' - 文章'}"></title>
        <div th:replace="fragment/front/css"></div>
        <link rel="stylesheet" type="text/css" th:href="@{/statics/page/css/front/article/index.css}" />
	</head>
	<body>
		<div th:replace="fragment/front/nav"></div>
		
		<div class="container-wrap posr">
			<div class="container">
				<div class="row">
					<div class="col-sm-12 col-md-12 aw-main-content">
						<div id="guide">
			               <div class="group">
			                   <ul>
			                       <li class="column">
			                           <a class="current">
			                               <i class="fa fa-bookmark"></i>不限类别
			                               <i class="fa fa-caret-down arrow"></i>
			                           </a>
			                           <ul class="sub">
			                               <li><a href="">前端开发</a></li>
			                               <li><a href="">用户研究</a></li>
			                               <li><a href="">视觉设计</a></li>
			                               <li><a href="">交互设计</a></li>
			                           </ul>
			                       </li>
			                       <li class="sort">
			                           <a class="current"><i class="fa fa-sort"></i>最新发布<i class="fa fa-caret-down arrow"></i></a>
			                           <ul class="sub">
			                               <li><a href="">喜欢最多</a></li>
			                               <li><a href="">浏览最多</a></li>
			                               <li><a href="">评论最多</a></li>
			                           </ul>
			                       </li>
			                       <li class="timeframe">
			                           <a class="current"><i class="fa fa-clock-o"></i>不限时间<i class="fa fa-caret-down arrow"></i></a>
			                           <ul class="sub">
			                               <li><a href="">一周内</a></li>
			                               <li><a href="">一月内</a></li>
			                               <li><a href="">一年内</a></li>
			                           </ul>
			                       </li>
			                   </ul>
			                </div>
			            </div>
			            <div id="primary" class="primary list">
			                <div class="article">
			                    <ul id="articleListWrap">
			                        <li th:each="article,rowStat:${articlePage}" th:id="*{article.id}" class="group">
			                            <div class="item-main">
			                                <div class="title">
			                                	<span class="myh2">
			                                	    <span th:if="${session.code_news_user != null and session.code_news_user.id == article.createUserId}" style="cursor:pointer" title="删除此文章" th:onclick="'cnCommonArticleIndex.del(\'' + *{article.id} + '\')'"><i class="fa fa-trash-o" aria-hidden="true"></i></span>
			                                	    <span th:if="${session.code_news_user != null and session.code_news_user.id == article.createUserId}" style="cursor:pointer" title="编辑此文章" th:onclick="'cnCommonArticleIndex.edit(\'' + *{article.id} + '\')'"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></span>
			                                		<a th:href="@{/front/article/detail/{articleId}.html(articleId=${article.id})}" rel="bookmark" th:title="*{article.articleTitle}" th:text="*{#strings.abbreviate(article.articleTitle,100)}"></a>
			                                	</span>
			                                </div>
			                                <div class="meta">
			                                    <div class="cat">
			                                        <a href="" rel="category tag" th:text="*{article.articleCategoryName}"></a>
			                                        <span class="tag-links">
			                                            <i>
			                                                <th:block th:each="articleLabel,articleLabelStat:*{#strings.listSplit(article.articleLabel,',')}">
				                                                <a href="" rel="tag" th:if="*{articleLabel != 'null'}" th:text="*{articleLabel}"></a>
				                                                <th:block th:if="*{articleLabelStat.count} &lt; *{articleLabelStat.size}">
				                                                 - 
			                                                    </th:block>
			                                                </th:block>
			                                            </i>
			                                        </span>
			                                    </div>
			                                    <div class="excerpt" th:text="*{#strings.abbreviate(article.articleIntroduction,200)}"></div>
		                                        <div class="data">
		                                            <time class="time"><i class="fa fa-calendar"></i> <th:block th:text="*{article.createUserName}"></th:block> 发布于 <recdate:format th:time="*{article.verifyTime}" /></time>
		                                            <span class="heart-num"><i class="fa fa-heart"></i><th:block th:text="*{article.articleCollectNum}"></th:block></span>
		                                            <span><i class="fa fa-fire"></i><th:block th:text="*{article.articleClickNum}"></th:block></span>
		                                            <span class="comment-num"><a href="" class="comments-link"><i class="fa fa-comment"></i><th:block th:text="*{article.articleCommentNum}"></th:block></a></span>
		                                        </div>
		                                        <div class="author">
		                                            <a target="_blank" href="" th:title="*{article.createUserName + ' 的主页'}" rel="author">
		                                                <img th:src="@{/statics/page/image/front/article/article.author.png}" class="avatar" th:alt="*{article.createUserId}" width="40" height="40"/> 
		                                            </a>
		                                        </div>
			                                </div>
			                            </div>
			                        </li>
			                        <li style="text-align: center; display: none" id="loading">
				                        <img alt="" th:src="@{/statics/page/image/front/article/loading.gif}"/>
				                    </li>
			                    </ul>
			                </div>
			            </div>
					</div>
				</div>				
			</div>
		</div>
				
		<div th:replace="fragment/front/footer"></div>
        <div th:replace="fragment/front/script"></div>
        <script th:src="@{/statics/page/js/front/article/index.js}"></script>
    </body>
</html>